<template>

	<view>
		<bg-video></bg-video>
		<cu-custom bgColor="bg-pink" :isBack="true">
			<block class="text-white" slot="content">报名列表</block>
		</cu-custom>
		<view>
			<view v-for="(bm,index) in aclientbms" :key="index">
				<view
					:style="'background-image:url('+bm.kcover+'); background-size: 100% 100%; z-index: 1;'"
					class="margin-sm shadow bg-white padding-xs relative" 
					@click="toBmDetail(bm.bmid)">
					<view class="w-100 h-100 absolute top0 left0 bg-half">
						
					</view>
					<view class="text-white flex">
						<view class="w-25">
							<view class="flex justify-center flex-direction align-center">
								<view class="cu-avatar xl round"
									:style="'background-image:url('+bm.jcover+');'"></view>
								<view class="padding-sm">{{bm.jlmc}}</view>
							</view>
						</view>
						<view class="w-75">
							<view class="padding-xs flex justify-between align-baseline text-lg">
								<text>{{bm.kcmc}}</text>
								<text class="text-yellow"><text class="text-sm">￥</text>{{bm.price}}</text>
							</view>
							<view class="padding-xs flex justify-end align-baseline">
								<text>
									使用会员次数【{{bm.syhycs}}】
								</text>
							</view>
							<view class="padding-xs flex justify-between align-baseline">
								<text class="bg-white round padding-xs text-bold">
									<text class="text-red" v-if="bm.stu == 'P'">排队中</text>
									<text class="text-green" v-if="bm.stu == 'B'">已报名</text>
									<text class="text-green" v-if="bm.stu == 'S'">已开始</text>
									<text class="text-red" v-if="bm.stu == 'F'">已结束</text>
									<text class="text-red" v-if="bm.stu == 'R'">提款中</text>
									<text class="text-green" v-if="bm.stu == 'T'">已提款</text>
									<text class="text-red" v-if="bm.stu == 'C'">已取消</text>
									<text class="text-green" v-if="bm.stu == 'J'">退款中</text>
									<text class="text-red" v-if="bm.stu == 'E'">已退款</text>
								</text>
								<text>{{bm.ct}}</text>
							</view>
							<view class="padding-xs flex justify-between">
								<text>
									已报名【{{bm.ybrs}}】人
								</text>
								<text>
									最大【{{bm.zdrs}}】人
								</text>
							</view>
						</view>
					</view>
					
					
				</view>
			</view>
		</view>
		
		<view v-if="aclientbms.length < pageInfo.total" class="padding flex flex-direction">
			<button @tap="loadMore" class="cu-btn bg-pink lg">显示更多</button>
		</view>
	</view>
</template>

<script>
	export default {
		data: function() {
			return {
				jl: this.store.state.jl,
				aclientbms: [],
				pageInfo: {
					current: 1,
					total: 0,
					size: 12
				}
			};
		},
		onShareAppMessage: function(){
			return {
				title: this.store.state.title,
				path: '/pages/first?id='+this.store.state.client.clientid
			}
		},
		onLoad: function(){
			this.Loadbm();
		},
		methods: {
			toBmDetail: function(bmid) {
				uni.navigateTo({
					url: '/pages/cjl/bm/detail?bmid='+bmid
				});
			},
			
			Loadbm: function(){
				this.api("/client/bm/page").send({
					jlid: this.jl.jlid,
					current:this.pageInfo.current,
					size : this.pageInfo.size
				}).then(data => {
					this.aclientbms.push(...this.aclientbms, ...data.aclientbms.records);
					this.pageInfo.current = data.current;
					this.pageInfo.size = data.size;
					this.pageInfo.total = data.total;
				});
			},
			loadMore: function() {
				this.pageInfo.current++;
				this.Loadbm();
			},
			
		}
	}
</script>

<style>
</style>